import React from 'react';
import { HashRouter, Route, Redirect, Switch } from 'react-router-dom';
import { LocaleProvider } from 'antd';
import zhCN from 'antd/lib/locale-provider/zh_CN';
import 'moment/locale/zh-cn';

import Admin from './admin.jsx';
import Common from './detailCommon.jsx';
import Login from '@pages/Login/Login.jsx';

import NoPage from '@pages/NoPage/NoPage.jsx';
import Home from '@pages/Home/Home.jsx';
import Buttons from '@pages/Ui/Buttons.jsx';
import Modal from '@pages/Ui/Modal.jsx';
import Loadings from '@pages/Ui/Loading.jsx';
import notification from '@pages/Ui/Notice.jsx';
import Message from '@pages/Ui/Message.jsx';
import Tabs from '@pages/Ui/Tabs.jsx';
import login from '@pages/Form/LoginForm.jsx';
import ResetForm from '@pages/Form/ResetForm.jsx';
import Register from '@pages/Form/Register.jsx';
import TableBasic from '@pages/Table/TableBasic.jsx';
import TableSelect from '@pages/Table/TableSelect.jsx';
import EchartMap from '@pages/Echart/EchartMap.jsx';
import EchartBar from '@pages/Echart/EchartBar.jsx';
import EchartPies from '@pages/Echart/EchartPies.jsx';
import EchartLine from '@pages/Echart/EchartLine.jsx';
import City from '@pages/City/City.jsx';
import OrderList from '@pages/OrderList/OrderList.jsx';
import Video from '@pages/Video/Video.jsx';
import OrderDetail from '@pages/OrderDetail/OrderDetail.jsx';

// admin 路由
const AdminRouter = (props) => {
  return (
    <Admin {...props}>
      <Switch>
        <Redirect exact from="/" to="/home" />
        <Route path="/home" component={Home} />
        <Route path="/ui/buttons" component={Buttons}/>
        <Route path="/ui/modals" component={Modal}/>
        <Route path="/ui/loadings" component={Loadings}/>
        <Route path="/ui/notification" component={notification}/>
        <Route path="/ui/messages" component={Message}/>
        <Route path="/ui/tabs" component={Tabs}/>
        <Route path="/form/login" component={login}/>
        <Route path="/form/resetform" component={ResetForm}/>
        <Route path="/form/reg" component={Register}/>
        <Route path="/table/basic" component={TableBasic}/>
        <Route path="/table/high" component={TableSelect}/>
        <Route path="/charts/map" component={EchartMap}/>
        <Route path="/charts/bar" component={EchartBar}/>
        <Route path="/charts/pie" component={EchartPies}/>
        <Route path="/charts/line" component={EchartLine}/>
        <Route path="/city" component={City}/>
        <Route path="/order" component={OrderList}/>
        <Route component={NoPage} />
      </Switch>
    </Admin>
  );
}

const DetailRouter = (props) => (
  <Common {...props}>
    <Switch>
      <Route path="/common/orderdetail/:id" component={OrderDetail} />
      <Route exact path="/common" component={NoPage} />
    </Switch>
  </Common>
);

// 总路由
const TotalRouter = () => {
  return (
    <LocaleProvider locale={zhCN}>
      <HashRouter>
        <Switch>  
          <Route path="/login" component={Login} />
          <Route path="/video" component={Video} />
          <Route path="/common" render={　(props) => <DetailRouter　{...props}/> }/>
          <Route path="/" render={(props) => <AdminRouter {...props}/> }/>
        </Switch>
      </HashRouter>
    </LocaleProvider>
  );
}

export default TotalRouter;